import { useState, useEffect } from 'react';
import { connect } from 'dva';
import Menu1 from '../menu/index';
import { Link } from 'umi';

function EmployeeList({ employee, dispatch }) {
  // componentDidMount
  useEffect(() => {
    dispatch({
      type: 'employee/getAll',
    });
  }, []);

  return (
    <div>
      <Menu1></Menu1>
      <div>
        <h1>Employee List Page</h1>
        <ul>
          {employee.map((e) => (
            <li key={e.id}>
              {e.name}{' '}
              <button
                onClick={() =>
                  dispatch({
                    type: 'employee/deleteEmployee',
                    payload: {
                      id: e.id,
                    },
                  })
                }
              >
                删除
              </button>
              <Link to={'/employee/' + e.id}>个人信息</Link>
              <Link to={'/employee/update/' + e.id}>修改个人信息</Link>
            </li>
          ))}
        </ul>
      </div>
    </div>
  );
}

export default connect(({ employee }) => ({ employee }))(EmployeeList);
